'use client'

import { useEffect, useRef } from 'react'
import { useNavigation } from '@/contexts/NavigationContext'
import { NavigationHeaderProps } from '@/components/NavigationHeader'

export function usePageNavigation(props: NavigationHeaderProps) {
  const { setNavigationProps } = useNavigation()
  const propsRef = useRef<NavigationHeaderProps | undefined>(undefined)

  useEffect(() => {
    // 只有当 props 实际发生变化时才更新
    const hasChanged = !propsRef.current || 
      propsRef.current.textColor !== props.textColor || 
      propsRef.current.logoSrc !== props.logoSrc

    if (hasChanged) {
      propsRef.current = props
      setNavigationProps(props)
    }
  }, [props.textColor, props.logoSrc, setNavigationProps])
}
